<!DOCTYPE html>
<html lang="en">
<head>
    {{include file="lib/page_head" /}}
    <style>
        table th{word-wrap:break-word;word-wrap:break-word;word-break:break-all;font-size:12px!important;}
        table td{word-wrap:break-word;word-wrap:break-word;word-break:break-all;}
        #edit_info .form-beautify-select{display:block;width: 100%!important;}
        .form-group{margin-bottom: 5px!important;}
    </style>
</head>
<body >

<!-- Preloader -->
<div id="preloader" style="display: none;">
    <div id="status"><i class="fa fa-spinner fa-spin"></i></div>
</div>

<section>
    {{include file="lib/page_left" /}}
    <div class="mainpanel">

        {{include file="lib/page_header" /}}

        <div class="contentpanel" >
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="panel-btns">
                        <a href="" class="panel-close">×</a>
                        <a href="" class="minimize">−</a>
                    </div>
                    <h4 class="panel-title">配置列表</h4>
                </div>
                <div class="panel-body">
                    <div class="form-inline"  id="info_list">
                        <div class="btn-group">
                            <button class="btn btn-primary" type="button" onclick="edit_info(0)">增加</button>
                            <button class="btn btn-primary" type="button" onclick="checked_edit_info()">编辑</button>
                            <button class="btn btn-primary" type="button" onclick="location.href = location.href;">刷新</button>
                        </div>

                    </div>

                </div>
            </div>
        </div><!-- contentpanel -->

    </div><!-- mainpanel -->
    {{include file="lib/page_right" /}}
</section>
<div style="display: none;" id="edit_info">
    <form class="layui-form" action="">
        <input name="id" value="0" type="hidden">


        <div class="form-group">
            <label class="col-sm-3 control-label">名称</label>
            <div class="col-sm-8">
                <input type="text" name="role_name"  placeholder="名称" class="form-control" >
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">描述</label>
            <div class="col-sm-8">
                <input type="text" name="role_desc"  placeholder="描述" class="form-control" >
            </div>
        </div>


        <div class="form-group">
            <label class="col-sm-3 control-label">状态</label>
            <div class="col-sm-8">
                <select class="select5" name="status" data- lay-ignore  >
                    <option value="0">是</option>
                    <option value="1">否</option>
                </select>
            </div>
        </div>

    </form>
</div>

<div style="display: none;" id="edit_role">
    <form class="" action="">
        <input name="id" value="0" type="hidden">
        <ul class="fonticon-list" >
            {{foreach $role_list as $key=>$val }}
            <li data-ttid="{{$val.id}}" data-pid="{{$val.pid}}">
                <div class="" style="margin-left:{{$val.level_child*30}}px">
                    <input id="washdish{{$val.id}}" value="{{$val.id}}" title="{{$val.name}}" type="checkbox" name="role_list" >
                </div>
            </li>
            {{/foreach}}
        </ul>


    </form>
</div>
<script src="../js/jquery-1.11.1.min.js"></script>
<script src="../js/jquery-migrate-1.2.1.min.js"></script>
<script src="../js/jquery-ui-1.10.3.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/jquery.sparkline.min.js"></script>
<script src="../js/toggles.min.js"></script>
<script src="../js/jquery.cookies.js"></script>
<script src="../js/jquery.tmpl.js"></script>
<script src="../js/custom.js"></script>
<script src="../layui/layui.js"></script>
<script src="../js/jquery.gritter.min.js"></script>
<script src="../js/form.beautify.js?t={{$version}}"></script>
<script src="../js/commen.js?t={{$version}}"></script>
<script src="../js/datatables.js?t={{$version}}"></script>
<link href="../css/ley.dialog.css" rel="stylesheet">
<script src="../js/ley.dialog.js?t={{$version}}"></script>
<script>
    function check_role_list(pobj,obj)
    {

        var checked = $(obj)[0].checked;
        var ttid = $(obj).parents("li").attr("data-ttid");
        var pid = $(obj).parents("li").attr("data-pid");
        var objs = child_role_list(ttid,pobj);
        for(var i=0;i<objs.length;i++)
        {
            objs[i].find("input[type='checkbox']")[0].checked =checked;
        }
        if(pid>0)
            checked_parent(pid,checked,pobj);
        $(obj).trigger("change");
    }
    function checked_parent(id,checked,pobj)
    {
        if(id<1)return;
        var obj = $("#edit_role .fonticon-list li[data-ttid='"+id+"']",pobj);
        if(obj.length>0)
        {
            if(checked)
            {
                obj.find("input[type='checkbox']")[0].checked = checked;

            }else{
                var objs = child_role_list(id,pobj);
                var is_checked = 0;
                for(var i=0;i<objs.length;i++)
                {
                    if(objs[i].find("input[type='checkbox']")[0].checked){
                        is_checked = is_checked+ 1;
                    }
                }
                if(!is_checked)
                {
                    obj.find("input[type='checkbox']")[0].checked = checked;
                }
            }
            checked_parent(obj.attr("data-pid"),checked,pobj);
        }
    }
    function child_role_list(pid,pobj)
    {
        var objs = [];
        var obj = $("#edit_role .fonticon-list li[data-pid='"+pid+"']",pobj);
        for (var i=0;i<obj.length;i++)
        {
            objs.push(obj.eq(i));
            var list = child_role_list(obj.eq(i).attr("data-ttid"),pobj);
            objs = objs.concat(list);
        }
        return objs;
    }
    layui.use(['layer','laypage',"element"], function(){



        //全选
//        form.on('checkbox(allChoose)', function(data){
//            var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
//            child.each(function(index, item){
//                item.checked = data.elem.checked;
//            });
//            form.render('checkbox');
//        });
        $("#info_list").datatables({
            rows:1,
            idField: 'id',
            columns:[
                {field:'ck',checkbox:true },
                {field:'id',title:'ID',width:120} ,
                {field:'role_name',title:'名称',width:100} ,

                {field:'role_desc',title:'描述',width:120} ,
                {field:'status',title:'状态',width:100,formatter:function (value,row,index) {
                    if(value==0)
                        return "是";
                    else
                        return "否";
                    }} ,
                {field:'operation',title:'操作',width:30,formatter:function (value,row,index) {
                        return '<div class="btn-group"> ' +
                            '<a data-toggle="dropdown" class="dropdown-toggle"> ' +
                            '<i class="fa fa-cog"></i> ' +
                            '</a> ' +
                            '<ul role="menu" class="dropdown-menu pull-right"> ' +
                            '<li><a href="javascript:void 0;" onclick="edit_info('+row.id+')">编辑</a></li> ' +
                            '<li><a href="javascript:void 0;" onclick="edit_role('+row.id+')">修改权限</a></li> ' +
                            '</ul> ' +
                            '</div>';
                    }},
            ],
            ajax:{
                url:"/adminrole/ajax_sys_role_list",
                callback:function (msg) {
                    var options = "";
                    for(var i=0;i<msg.data.length;i++)
                    {
                        var text = "";
                        for(var f=0;f<msg.data[i].level_child;f++)
                        {
                            text += "&nbsp;&nbsp;";
                        }
                        options += '<option value="'+msg.data[i].id+'">&nbsp;&nbsp;'+text+msg.data[i].name+'</option>';
                    }
                    if(options.length>0)
                    {
                        options = '<option value="0">顶级分类</option>'+options;
                    }
                    $("#edit_info select[name='pid']").html(options);
                    check_table_list_data(msg);
                    check_parent_height();

                }

            }

        });
    });




    function checked_edit_info() {
        var obj = $("#info_list input[name='ck']:checked");
        if(obj.length>1)
        {
            openMsg("只允许选择一条记录编辑");
        }else if(obj.length < 1)
        {
            openMsg("请选择一条记录编辑");
        }else{
            edit_info(obj.val())
        }
    }
    function add_info(id)
    {
        edit_info(0);
        $("#edit_info select[name='pid']").val(id).trigger("change");
    }
    function edit_role(id)
    {
        $("#edit_role>form")[0].reset();
        AjaxCommen("GET","/adminrole/ajax_sys_role_menu_list",{id:id},function (msg) {
            if (!msg.error)
            {
                $("#edit_role input[name='id']").val(id);


                openDialog2({title:"权限列表",content:$("#edit_role"),clone:true,area: ['600px;','400px'],
                    before:function (layero) {
                        console.log("aaa");
                        var obj = $(".fonticon-list ",layero);
                        for(var i=0;i<msg.data.length;i++)
                        {
                            if(obj.find("li[data-ttid='"+msg.data[i]+"'] input[type='checkbox']").length>0)
                            {
                                obj.find("li[data-ttid='"+msg.data[i]+"'] input[type='checkbox']")[0].checked = true;
                            }
                        }
                        layero.find("input[type='checkbox']").trigger("change");
                        layero.find("input[type='checkbox']").click(function () {

                            check_role_list(layero,this);
                        });


                    },
                    yes:function (index,layero) {
                        var id = $("#edit_role input[name='id']",layero).val();
                        var role_list = [];
                        var objs = $("#edit_role .fonticon-list input:checked",layero);
                        for (var i =0;i<objs.length;i++)
                        {
                            role_list.push(objs.eq(i).val())
                        }
                        AjaxCommen("POST","/adminrole/ajax_sys_role_set_menu_list",{id:id,role_list:role_list},function (msg) {
                            if (!msg.error)
                            {
                                openMsg("成功");
                                layero.close();
                                search();
                            }
                        });
                    }
                });
            }
        });

    }
    function edit_info(id) {

        $("#edit_info form")[0].reset();
        $(".select5,.select6").trigger("change");
        $("#edit_info").find("input[name='id']").val(0);
        if(id>0)
        {
            AjaxCommen("GET","/adminrole/ajax_sys_role_info",{id:id},function (msg) {
                if (!msg.error)
                {
                    var obj = $("#edit_info input,#edit_info select,#edit_info textarea");
                    for(var i=0;i<obj.length;i++)
                    {
                        var name = obj.eq(i).attr("name");
                        if(msg.data[name])
                        {
                            obj.eq(i).val(msg.data[name]);
                            if(obj.eq(i).is("select"))
                            {
                                obj.eq(i).trigger("change");
                            }
                        }
                    }
                    open_info();
                }
            });
        }else{
            open_info();
        }

    }

    function get_search_data()
    {
        var data = {};

        var agent_name = $("#search_form input[name='agent_name']").val();

        data["agent_name"] = agent_name;


        return data;
    }
    function search()
    {
        var data = get_search_data();
        $("#info_list").setParems(data);
        $("#info_list").reload();
    }
    function search_reset() {
        $("#search_form")[0].reset();
        search();
    }
    function open_info()
    {

        openDialog2({
            title:"信息",
            area: ['600px;','300px'],
            content:$("#edit_info"),
            clone:true,
            id:"edit_info_list",
            yes:function (index,layero) {
                var info = {};
                var obj = $("#edit_info input,#edit_info select,#edit_info textarea",layero);
                for(var i=0;i<obj.length;i++)
                {
                    var name = obj.eq(i).attr("name");
                    info[name] = obj.eq(i).val();

                }

                if(info.role_name.length<1)
                {
                    openMsg("名称不能为空");
                    return false;
                }

                AjaxCommen("POST","/adminrole/ajax_sys_role_save",info,function (msg) {
                    if (!msg.error)
                    {
                        openMsg("成功");
                        layero.close();
                        search();
                    }
                });


            }
        });
    }

</script>

</body>
</html>